import { getToken } from '../../../utils/getToken'
import { formateDate } from '../../../utils/formateDate'
Page({
  data: {
    // 报修详情id
    id: '',

    currentDate: Date.now(),
    // 控制报修房屋是否显示变量
    isHouseLayerShow: false,
    // 报修房屋列表数据
    repairHouseList: [],
    repairHouseId: '',
    repairHouseName: '',


    // 报修项目是否显示
    isRepairLayerShow: false,
    // 报修项目列表
    repairItemList: [],
    repairItemId: '',
    repairItemName: '',

    // 日期弹窗相关
    isDateLayerShow: false,

    // 用户选择的时间
    appointment: '',

    // 用户手机号
    mobile: '',
    // 问题描述
    description: '',

    // 附件相关
    attachment: [],
  },

  onLoad(options) {
    // 获取用户的房屋列表
    this.getRepairHouseList()
    // 获取报修列表
    this.getRepairItemList()
    // 如果传递了houseId表示修改，获取数据，表单回填
    if (options.houseId) {
      this.getHouseRepairDetail(options.houseId)
    }
  },

  // 获取保修详情
  getHouseRepairDetail(houseId) {
    wx.request({
      url: `https://live-api.itheima.net/repair/${houseId}`,
      method: 'GET',
      header: {
        Authorization: 'Bearer ' + getToken()
      },
      success: (res) => {
        // 设置页面数据
        console.log('保修详情', res)
        this.setData({
          // 如果是编辑，id就会有值
          id: res.data.data.id,
          repairHouseId: res.data.data.houseId,
          repairHouseName: res.data.data.houseInfo,
          repairItemId: res.data.data.repairItemId,
          repairItemName: res.data.data.repairItemName,
          mobile: res.data.data.mobile,
          description: res.data.data.description,
          appointment: res.data.data.appointment,
          attachment: res.data.data.attachment,
        })
      }
    })
  },

  // 获取用户的房屋列表
  getRepairHouseList() {
    wx.request({
      url: 'https://live-api.itheima.net/house',
      method: 'GET',
      header: {
        Authorization: 'Bearer ' + getToken()
      },
      success: (res) => {
        console.log('===>', res)
        if (res.data.code !== 10000) {
          return wx.showToast({
            title: res.data.message,
          })
        }
        // 设置页面数据
        this.setData({
          repairHouseList: res.data.data
        })
      }
    })
  },

  getRepairItemList() {
    // 获取报修列表
    wx.request({
      url: 'https://live-api.itheima.net/repairItem',
      method: 'GET',
      header: {
        Authorization: 'Bearer ' + getToken()
      },
      success: (res) => {
        console.log('===>', res)
        if (res.data.code !== 10000) {
          return wx.showToast({
            title: res.data.message,
          })
        }
        // 设置页面数据
        this.setData({
          repairItemList: res.data.data
        })
      }
    })
  },

  // 房屋选择事件处理
  handleRepairHouseSelect(e) {
    console.log(e)
    // 设置页面数据
    this.setData({
      repairHouseId: e.detail.id,
      repairHouseName: e.detail.name
    })
  },

  // 维修项目事件处理
  handleRepairItemSelect(e) {
    console.log(e)
    this.setData({
      repairItemId: e.detail.id,
      repairItemName: e.detail.name
    })
  },


  openHouseLayer() {
    this.setData({ isHouseLayerShow: true });
  },
  closeHouseLayer() {
    this.setData({ isHouseLayerShow: false });
  },
  openRepairLayer() {
    this.setData({ isRepairLayerShow: true });
  },
  closeRepairLayer() {
    this.setData({
      isRepairLayerShow: false,
    });
  },

  openDateLayer() {
    this.setData({ isDateLayerShow: true });
  },
  closeDateLayer() {
    this.setData({ isDateLayerShow: false });
  },
  // 日期取消事件处理函数
  handleDateCancel(e) {
    this.setData({
      isDateLayerShow: false
    })
  },
  // 日期确认事件处理函数
  handleDateConfirm(e) {
    console.log(e.detail)
    this.setData({
      isDateLayerShow: false,
      appointment: formateDate(e.detail)
    })
  },

  // 报修图片选择事件处理函数
  handleImageAfterRead(e) {
    console.log(e)
    wx.uploadFile({
      filePath: e.detail.file.url,
      name: 'file',
      url: 'https://live-api.itheima.net/upload',
      header: {
        Authorization: 'Bearer ' + getToken()
      },
      success: (res) => {
        console.log('图片上传res', res)
        const parseData = JSON.parse(res.data)
        // 数据异常的处理
        if (parseData.code !== 10000) {
          return wx.showToast({
            title: parseData.message,
          })
        }
        // 设置页面数据
        this.setData({
          attachment: [...this.data.attachment, { url: parseData.data.url, isImage: true }]
        })
      }
    })



    // this.setData({
    //   attachment: [...this.data.attachment, { url: e.detail.file.url }]
    // })
  },

  handleRepairSubmit() {

    // 提交前的表单校验
    if (this.validateRepairData(this.data)) {
      console.log('提交数据吧', this.data)
      wx.request({
        url: 'https://live-api.itheima.net/repair',
        method: 'POST',
        header: {
          Authorization: 'Bearer ' + getToken()
        },
        data: {
          id: this.data.id,
          houseId: this.data.repairHouseId,
          repairItemId: this.data.repairItemId,
          mobile: this.data.mobile,
          appointment: this.data.appointment,
          description: this.data.description,
          attachment: this.data.attachment
        },
        success: (res) => {
          console.log('报修表单提交res', res)
          // 数据判断
          if (res.data.code !== 10000) {
            return wx.showToast({
              title: res.data.message,
            })
          }
          // 页面跳转
          wx.redirectTo({
            url: '/repair_pkg/pages/list/index',
          });
        }
      })

    }

    // wx.reLaunch({
    //   url: '/repair_pkg/pages/list/index',
    // });
  },

  // 表单校验函数
  validateRepairData(data) {
    // 房屋是否选择判断
    if (!this.data.repairHouseId.trim()) {
      wx.showToast({
        title: '请选择报修房屋',
        icon: 'none'
      })
      return false
    }

    // 维修项目是否选择判断
    if (!this.data.repairItemId.trim()) {
      wx.showToast({
        title: '请选择报修项目',
        icon: 'none'
      })
      return false
    }

    // 手机号校验
    if (!this.data.mobile.trim()) {
      wx.showToast({
        title: '请输入手机号码',
        icon: 'none'
      })
      return false
    }
    // 手机号格式校验
    const mobileReg = /^[1][3-8][0-9]{9}$/
    if (!mobileReg.test(this.data.mobile.trim())) {
      wx.showToast({
        title: '手机号码格式不正确',
        icon: 'none'
      })
      return false
    }

    // 预约日期校验
    if (!this.data.appointment.trim()) {
      wx.showToast({
        title: '请选择预约日期',
        icon: 'none'
      })
      return false
    }

    // 报修问题描述
    if (!this.data.description.trim()) {
      wx.showToast({
        title: '请输入问题描述',
        icon: 'none'
      })
      return false
    }
    return true;
  }
});
